import React, { useState, FC } from 'react'
import { message, Input } from 'antd';
import { Button } from 'antd';
import useStyles from '../../style.style';
import moment from 'moment'

interface CommitInputprops {
  getInputContent: (value: any) => void;
}

const CommitInput: FC<CommitInputprops> = ({ getInputContent }) => {
  const { styles } = useStyles();
  const [value, setValue] = useState<string>('');

  const handelTheinputContent = (e: any) => {
    setValue(e.target.value)
  }
  const CommitInputContainerButton = () => {
    if (!value) {
      message.info('请添加评论')
      return
    }
    // let setInputContent = {
    //   value: value,
    //   time: moment().format('MMMM Do YYYY, h:mm:ss a'),
    //   img: 'https://avatars.githubusercontent.com/u/49740023?v=4',
    //   name: '奥奥奥'
    // }
    getInputContent?.(value);
    setValue('')
  }

  return (
    <div>
      <div className={styles.InputContainer}>
        <Input.TextArea placeholder='请输入评论' rows={4} value={value} onChange={(e) => handelTheinputContent(e)} />
        <Button className={styles.InputContainer_button} onClick={CommitInputContainerButton} type="primary">提交评论</Button>
      </div>
    </div>
  )

}

export default CommitInput